6 CSS Web Editor Untuk Linux (Free)

6 CSS Web Editor Untuk Linux (Free)

Web Design Unknown   4:31 PM

CSS Web Editor Untuk Linux (Free) — Biasanya desainer web identik dengan penggunaan sistem operasi Mac OS X untuk urusan pembuatan desain web, namun tidak sepenuhnya harus seperti itu karena sistem operasi apapun bisa digunakan untuk melakukan pekerjaan sebagai seorang desainer web. Termasuk bisa menggunakan Windows bahkan Linux sekalipun, bahkan pengguna windows sangat banyak yang berprofesi sebagai desainer web.

Jika Anda adalah seorang frontend designer yang menggunakan linux, berikut ini adalah beberapa aplikasi css editor yang bisa Anda gunakan.

1. Sublime Text

Editor pertama yang bisa digunakan adalah Sublime Text, editor ini bisa Anda gunakan secara gratis dan tentu saja memiliki banyak sekali kelebihan. Editor ini juga dilengkapi dengan berbagai plugin tambahan yang biasa disebut package.

2. jEdit

jEdit dikenal oleh kalangan programmer yang sudah mature. jEdit memiliki antarmuka yang akan mengingatkan Anda tentang DOS, namun bicara soal fungsi, jEdit mampu mengalahkan alat pengembangan yang berbayar.

3. Bluefish

Bluefish adalah editor yang bagus untuk pengembang web. Tools ini sudah sejak lama terkenal sebagai editor web, dan dengan editor ini tentu saja bisa digunakan untuk mengedit file css juga. Selain di Linux, Bluefish ini juga bisa digunakan di Windows dan Mac.

4. Scintilla

Scintilla adalah kode editor CSS untuk para pengembang web. Ini adalah salah satu editor yang sangat berguna yang bisa digunakan untuk membuat dan menjalankan program. Aplikasi ini hanya tersedia di Windows dan Linux. SciTE tersedia hanya untuk sistem Linux dan Windows yang berbasis intel. Dokumentasi SciTE cukup bagus untuk dikonfigurasi dengan barbgai bahasa dan API.

5. Quanta

Quanta adalah CSS editor yang ringan. Versi plus dari alat ini memiliki banyak fitur tambahan, diantaranya adalah interface dokumen multi template dan bisa mengedit dengan WYSIWYG. Aplikasi ini terus dikembangkan dan memiliki plugin tambahan serta ada PHP debugger.-

6. cssed

cssed adalah css editor ringan untuk Linux. Alat ini dilengkapi berbagai kelengkapan untuk membuat web dengan css seperti, tampilan MDI, validasi sintak dan ada highlighting. Anda bisa menggunakan cssed untuk mengedit HTML, XML, Perl, Phyton, SQL dan berberapa bahasa lainnya.

Itulah beberapa css editor yang bisa jadi referensi yang bagus untuk para pengembang web.

7 Tutorial Cara Membuat Desain Web Menggunakan GIMP

7 Tutorial Cara Membuat Desain Web Menggunakan GIMP

Web Design Unknown   4:28 PM

Tutorial cara membuat desain web menggunakan Gimp — Dunia dimana kita tinggal sekarang ini dilengkapi dengan teknologi yang sangat canggih yang bisa digunakan untuk keperluan desain, baik itu desain poster, spanduk, brosur dan media cetak lainnya. Selain itu juga termasuk desain digital seperti desain halaman website.

Untuk membuat produk-produk desain tersebut biasanya menggunakan sebuah software yang berfungsi sebagai pengolah citra atau gambar seperti Adobe Illustrator, Coreldraw, Photoshop, ataupun Firework. Namun semua software tersebut tidak gratis dan bisa dibilang cukup mahal.

Bagi Anda yang memiliki modal kecil dan lebih suka dengan produk-produk open source Anda tidak perlu khawatir, karena ada software yang memiliki kemampuan seperti software berbayar namun bisa Anda dapatkan secara gratis, yaitu GIMP, software ini biasanya digunakan oleh pecinta linux. Namun pengguna Windows dan Mac OSX juga bisa menggunakan aplikasi open source ini.

Untuk Anda web desainer yang baru dan ingin belajar membuat desain website dengan menggunakan GIMP, Jurnalweb.com tampilkan beberapa tutorial pembuatan desain web dengan menggunakan GIMP.

1. Bagaimana membuat desain website menggunakan GIMP

Tutorial ini mengajarkan Anda langkah-langkah pembuatan desain website dengan menggunakan GIMP. Anda bisa mengambil pelajaran dasar tentang penggunaan GIMP untuk website di tutorial ini, selanjutnya tinggal bagaimana kreasi Anda untuk membuat yang lebih baik.

2. Tutorial membuat desain blog dengan GIMP

Tutorial ini membahas pembuatan desain blog dengan menggunakan GIMP, Anda akan diajarkan membuat desain dengan tema retro dan Anda bisa mengambil beberapa teknik disitu untuk diaplikasikan lebih lanjut sesuai dengan kreativitas Anda.

Desain Web Dengan Gimp (Image:gimp-tutorial.net)

3. Pembuatan desain web keren dengan Gimp

Anda bisa belajar cara membuat desain blog dan portfolio sederhana dengan menggunakan Gimp, Anda akan menggunakan beberapa tools yang dimiliki Gimp seperti Rectangle Select Tool, Bucket Fill Tool, Blend Tool, Paths Tool, Text Tool, dan lainnya.

4. Dasar pembuatan layout website dengan Gimp

Tutorial ini adalah sebuah video yang mengajarkan bagaimana dasar pembuatan desain layout website menggunakan Gimp

5. Tutorial pembuatan desain layout web biru dengan Gimp

Tutorial ini juga berupa video yang akan menjelaskan langkah-langkah membuat layout website dasar dengan menggunakan Gimp

6. Membuat website lengkap dengan Gimp

Belajar cara membuat desain website dengan menggunakan Gimp, layout yang dibuat berwarna gelap / hitam.

7. Membuat menu navigasi modern dengan Gimp

Menu Navigasi Dengan Gimp(Image:gimp-tutorial.net)

Website tentu memiliki menu navigasi agar pengunjung tidak bingung dalam menjelajahi seluruh ini website, dan tutorial ini mengajarkan bagaimana membuat menu navigasi modern menggunakan Gimp.

Cara Mengoptimalkan Desain Website Dengan Foto Potret Berukuran Besar

Cara Mengoptimalkan Desain Website Dengan Foto Potret Berukuran Besar

Web Design Unknown   1:27 PM

Trik mengoptimalkan desain website dengan foto potret berukuran besar — Apa yang pertama kali anda lihat dan anda ingat ketika bertemu dengan seseorang? persentase paling besar tentulah mukanya, selanjutnya mungkin warna kulit, tinggi, dll. Muka menjadi tembok paling depan, muka yang ramah, muka yang berkarakter tentu sangat mudah untuk di ingat oleh orang yang memandang.
Dalam dunia web desain ternyata muka seseorang juga bisa dimanfaatkan untuk menarik perhatian pengunjung. Dengan kecepatan koneksi internet saat ini yang semakin membaik, penggunaan gambar yang berukuran besar mulai sering diterapkan, penggunaan potret muka seseorang yang di close-up ternyata 2 tahun belakangan ini menjadi trend yang cukup digemari oleh para desainer web dari berbagai penjuru dunia.
Banyak website yang terlihat menarik dengan menerapkan hal tersebut, kita mengetahui bahwa citra yang kuat pada website adalah kunci. Penggunaan gambar muka yang besar bisa menekan penggunaan teks, hal ini bisa menuntun mata pembaca untuk menelusuri halaman dan dapat membuat keseimbangan antara informasi visual dan tertulis.
Gambar yang besar merupakan bagian dari visual desain, dan sebenarnya apa fungsi visual ini dalam sebuah website?

1. Potret bertanggung jawab untuk mendukung konten website. Mereka mengkomunikasikan ide-ide bisnis dan membantu membangun hubungan visual yang kuat dengan pengunjung.
2. Prioritaskan Informasi. Aksen visual banyak digunakan untuk menggaris bawahi poin-poin kunci.
3. Panduan Melalui Website – Visual yang baik dan terorganisir merupakan bagian dari kemudahan navigasi karena dapat menunjukan kepada pengunjung cara untuk mengikuti alur website.

Dukungan visual yang baik dari setiap desain dapat membuat website tampil lebih menarik dan menciptakan rasa pada pengunjung dan itu bisa menawarkan pada pengunjung untuk menikmati nya. Foto, ikon, tombol, latar belakang – semua elemen tersebut menyusun bagian visual dari tata letak.
Memasukan gambar latar belakang besar pada website adalah salah satu teknik yang sudah berkembang luas. Mereka dapat diimplementasikan dalam header website, konten website (bagian dari postingan pada sebuah blog) atau diseluruh bagian website (full satu layar komputer).
Foto potret close-up adalah salah satu trend desain website saat ini. Anda salah jika berfikir bahwa hanya fashion atau foto proyek yang memanfaatkan ini. Website bisnis, pendidikan, kesehatan, dan website bertema seni sukses menerapkan gambar potret untuk membuat desain mereka lebih personal, memberikan sentuhan unik yang bagus untuk mereka dan meningkatkan hubungan dengan pengunjung. Sebenarnya itu adalah tujuan utama (bersama dengan efek visual) menggunakan close-up potret. Ketika desainer memilih potret yang bagus dan sesuai dengan keseluruhan tampilan website, yang disebutkan diatas maka misi dianggap tercapai. Mari kita lihat hal tersebut dilakukan di beberapa website dibawah ini.

David Hellmann

The Green Soccer Journal

Beards

Paintbox

Code42

Kennedy

Eazers

Locals Appare

Edita’s Casting

Julia Gavrilova

Van Schnider

Bryter

Daniella Draper

Sudah anda lihat satu per satu demo website nya? Luar biasa keren bukan? gambar yang baik memang pemikat yang baik pada sebuah website, tapi perlu dipertimbangkan untuk membuat gambar besar tersebut menjadi lebih kecil ukuran file nya, mungkin di kompres atau pemilihan format gambar juga bisa mempengaruhi ukuran file. Diperlukan kebijakan web designer agar website tampil oke namun tetap tidak menyusahkan pengunjung dengan load website yang berat.
Satu hal lagi yang perlu diperhatikan dari contoh-contoh website diatas adalah, penggunaan gambar yang besar akan terlihat sangat baik jika menggunakan font yang baik pula. Anda bisa menggunakan Font Terbaik dan Populer Untuk Website, atau  bisa juga membuat font anda sendiri dengan Software dan Alat Gratis Untuk Membuat Font Sendiri ini.
Jadi apakah anda sudah siap dengan kamera anda? kalau sudah siap mari ambil gambar terbaik untuk proyek website yang sedang anda kerjakan :) Semoga membuat website anda tampil lebih mewah, lebih memikat, memberi pengalaman kepada pengunjung dan lebih mudah untuk di ingat, website yang mudah di ingat mudah untuk dikunjungi kembali dilain waktu, contohnya seperti website posharian.tk ini, semoga anda mudah mengingatnya dan sering berkunjung kesini :)

Mengubah Tulisan Tangan di Kertas Menjadi Gambar Vektor (Video)

Mengubah Tulisan Tangan di Kertas Menjadi Gambar Vektor (Video)

Web Design Unknown   1:24 PM

Mengubah tulisan tangan menjadi vektor — Jika Anda suka membuat desain tulisan ataupun font di kertas dan Anda merasa desain Anda itu bagus, maka mengapa Anda tidak menjadikannya sebuah tulisan digital yang bisa dilihat dengan lebih baik di komputer.

ubah tulisan tangan jadi vektor Image by creativemarket.com

Video singkat berikut ini mengajarkan kita sedikit bagaimana cara membaut tulisan tangan menjadi tulisan digital, dimana prosesnya adalah anda cukup melakukan scan tulisan Anda yang dikertas agar bisa dibuka di komputer, lalu proses selanjutnya menggunakan photoshop dan illustrator untuk membuatnya menjadi gambar vektor.
Tidak perlu pengalaman selama lima tahun dalam penggunaan pen tool untuk mengikuti tutorial ini, prosesnya sangat mudah, bahkan bisa diikuti oleh pemula sekalipun. Berikut adalah video nya.

7 Cara Mengetahui Jenis Font Dari Sebuah Gambar atau Web

7 Cara Mengetahui Jenis Font Dari Sebuah Gambar atau Web

Web Design Unknown   1:20 PM

Cara mengetahui jenis font dari sebuah gambar atau website — Ada banyak sekali font di Internet, ada yang gratis maupun berbayar. Dan desainer biasanya akan mencari font yang bagus untuk menunjang tampilan desain yang dia buat. 
Terkadang ketika kita melihat sebuah desain hasil karya orang lain yang bagus, kita jadi terinspirasi untuk membuat hal yang sama, atau menggunakan font yang sama dengan yang dia gunakan. Namun sayangnya font tersebut sudah menjadi gambar(jpg,png & lainnya) dan sulit untuk diketahui apa jenisnya. Berbeda dengan font yang ada di website yang bisa di lihat script nya, nanti akan diketahui jenis font nya.
Nah untuk Anda yang kesulitan mengetahui jenis font dari sebuah gambar, maka Anda bisa mencoba website-website berikut ini.

1. Font Matcherator

Font Matcherator (Image: Twitter.com)

Upload sebuah gambar yang ada tulisannya, maka mereka akan mengetahui jenis font nya. Begitu menurut tagline yang ada di website Font Matcherator.

2. WhatTheFont

WhatTheFont (Image: vandelaydesign.com)

WhatTheFont adalah salah satu tool yang paling bagus untuk mengetahui jenis font dari sebuah gambar, dengan alat ini Anda cukup upload gambar tersebut, baik JPG, PNG, GIF, dengan ukuran maksimumnya 2MB dan nanti sistem mereka akan menganalisa dan membantu Anda mengetahui jenis font yang ada di gambar tersebut.

3. Identifont

Identifont ini agak berbeda dengan WhatTheFont, karena mereka bekerja dengan cara menanyakan beberapa pertanyaan terkait font yang Anda cari. Alat ini tentu berguna jika Anda tidak memiliki sample gambar dari font tersebut.

4. Flickr Typeface Identification

Ternyata Flickr bukan hanya soal foto-foto, namun bisa digunakan untuk mengidentifikasi font, hal ini karena Flickr memili group yang didedikasikan untuk mencari jenis font tertentu dengan nama Flickr Typeface Identification, selain itu disitu terdapat beberapa gambar yang sudah diidentifikasi jenis font nya.

5. WhatFontIs

WhatFontIs (Image; vandelaydesign.com)

Hampir sama cara kerjanya dengan tools yang lain, di website WhatFontIs ini anda juga cukup mengupload sebuah gambar yang ada teks nya nanti akan diketahui jenis font nya.

6. Fount

Fount adalah font yang dikhususkan untuk mengetahui jenis font yang digunakan oleh sebuah website, Fount merupakan sebuah addon untuk browser, jadi anda cukup menginstall fount, dan nanti Anda akan bisa mengetahui font apa yang digunakan oleh setiap website yang Anda kunjungi.

7. FontFace Ninja

Ketika Anda mengunjungi sebuah website dan ingin mengetahui font yang digunakan pada website itu, maka Anda bisa memanfaatkan FontFaceNinja, fungsinya sama dengan Faunt.

26 Font Google Terbaik Ini Akan Mempercantik Website Anda

26 Font Google Terbaik Ini Akan Mempercantik Website Anda

Web Design Unknown   1:18 PM

Font Google terbaik yang kita pilih untuk website tentu akan memberikan dampak yang sangat signifikan untuk menambah keindahan tampilan website termasuk juga keterbacaan tulisan di halaman web.
Tipografi adalah salah satu faktor penting dalam desain website, desain serta pemilihan font atau jenis huruf akan menciptakan kesan tersendiri bagi pengguna atau pengujung website Anda.
Jadi tidak heran ada orang yang menghabiskan waktu berjam-jam untuk memilih font yang sesuai untuk website nya, semua tentu demi tampilan baik dan membantu tercapainya tujuan dari website tersebut.
Salah satu sumber yang biasa digunakan oleh desainer web dalam mencari font untuk website yang dibuatnya adalah Google Web Font.

Font Playfair Display (Image: theultralinx.com)

Di Google Web Font tersedia banyak sekali font yang bisa digunakan secara gratis, bisa dengan mengembed font dari server Google atau bisa juga dengan mendownload font tersebut ke komputer.
Untuk Anda yang bingung memilih font yang begitu banyak di Google Web Font, berikut ini ada beberapa font google terbaik yang bisa Anda gunakan. Tulisan ini terlalu banyak gambar, jadi kami buat jadi beberapa halaman agar tidak berat ketika diakses.

1. Playfair Display

Detail — Download ZIP

2. Work Sans

Detail — Download ZIP

3. Alegreya

Detail — Download ZIP

4. Fira Sans

Detail — Download ZIP

5. Inconsolata

Detail — Download ZIP

6. Source Sans Pro

Detail — Download ZIP

7. Source Serif Pro

Detail — Download ZIP

8. Lora*

Detail — Download ZIP

9. Neuton

Detail — Download ZIP

10. Poppins

Detail — Download ZIP

11. Crimson Text

Detail — Download ZIP

12. Open Sans

Detail — Download ZIP

13. Merriweather

Detail — Download ZIP

14. Roboto

Detail — Download ZIP

15. Lato

Detail — Download ZIP

16. Anonymous Pro

Detail — Download ZIP

17. Archivo Narrow

Detail — Download ZIP

18. Libre Baskerville

Detail — Download ZIP

19. Karla

Detail — Download ZIP

20. Montserrat

Detail — Download ZIP

21. Chivo

Detail — Download ZIP

22. Domine

Detail — Download ZIP

23. Varela Round

Detail — Download ZIP

24. Bitter

Detail — Download ZIP

25. Cardo

Detail — Download ZIP

26. PT Serif

Detail — Download ZIP
Itulah beberapa font google terbaik yang posharian lansir dari TypeWoff, font tersebut bisa Anda gunakan untuk mempercantik tampilan website yang sedang Anda buat.
Selamat bereksperimen…